<!--
 * @Author: [you name]
 * @Date: 2021-10-22 14:13:55
 * @LastEditors: [you name]
 * @LastEditTime: 2021-10-25 09:10:55
 * @Description: 
-->
<template>
    <div class="logs">
        <el-table style="width: 100%"  :data="tableData.list">
        <el-table-column type="index" label="序号"></el-table-column>
        <el-table-column prop="realname" label="访问人真实姓名"></el-table-column>
        <el-table-column prop="method" label="访问方式"></el-table-column>
        <el-table-column prop="content" label="访问路径"></el-table-column>
        <el-table-column label="访问时间">
            <template v-slot="scope">
                {{scope.row.logTime | fmtDateTime}}
            </template>
        </el-table-column>
    </el-table>
    <el-pagination
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="tableData.page"
      :page-sizes="[7, 10, 15, 20]"
      :page-size="tableData.pageSize"
      layout="total, sizes, prev, pager, next"
      :total="tableData.total"
    >
    </el-pagination>
    </div>
</template>

<script>
import request from "@/utils/request";
export default {
    data(){
        return {
            tableData: {},
            queryParams: {
                page: 1,
                pageSize: 10,
            },
        }
    },
    methods: {
        pageQueryLogs() {
            request.get("/baseLog/pageQuery", {
                // params: {
                //   page: this.queryParams.page,
                //   pageSize: this.queryParams.pageSize,
                // },
                params: this.queryParams,
            })
            .then((res) => {
                this.tableData = res.data;
                console.log(res);
            });
        },
        handleSizeChange(pageSize) {
            // 点击分页容量，将最新的pageSize设置到数据模型中
            this.queryParams.pageSize = pageSize;
            // 数据重载
            this.pageQueryLogs();
        },
        // 分页page 跳转 事件
        handleCurrentChange(page) {
            // 跳转到点击的页
            this.queryParams.page = page;
            this.pageQueryLogs();
        },
    },
    
    created(){
        this.pageQueryLogs()
    }
}
</script>